<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
		<title></title>
		<script src="js/jquery-2.1.0.js"></script>
		<!-- 引入样式 -->
		<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/vant@1.6/lib/index.css">

		<!-- 引入组件 -->
		<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.min.js"></script>
		<script src="https://cdn.jsdelivr.net/npm/vant@1.6/lib/vant.min.js"></script>
		<script src="html5plus://ready"></script>
		<script type="text/javascript">
			
		</script>
	</head>
	<body>
		<div id="app">			
			<van-tabbar v-model="active"  @change="tabchanged" >
				<van-tabbar-item icon="shop-o">首页</van-tabbar-item>
				<van-tabbar-item icon="shop-collect">分类</van-tabbar-item>
				<van-tabbar-item icon="shopping-cart-o"  @click="Login">购物车</van-tabbar-item>
				<van-tabbar-item icon="manager-o" @click="Login">个人中心</van-tabbar-item>
			</van-tabbar>
		</div>
		<script>
			var vm = new Vue({
				el: "#app",
				data: {
					active: 0,
					views: [{
							name: "home",
							url: "views/home.html"
						},
						{
							name: "fenlei",
							url: "views/fenlei.html"
						},
						{
							name: "shop",
							url: "views/shop.html"
						},
						{						
							name: "setas",
							url: "views/setas.html"
						}
					]
				},
				methods: {	
					tabchanged: function() {
						plus.webview.show(this.views[this.active].name)
					},
					Login:function(){
						var _this =this;
						if(_this.views[_this.active].name=="shop"){
						if(localStorage.getItem("key")==null){
                     	plus.webview.create("views/Login.html","Login").show();
						}else{
						 plus.webview.show(_this.views[_this.active].name);
						}
					}
					else{						
					plus.webview.show(_this.views[_this.active].name)
					}
				}
			},
				mounted: function() {
					var _this = this;
					document.addEventListener('plusready', function() {
						//console.log("所有plus api都应该在此事件发生后调用，否则会出现plus is undefined。"
					     var currentWebView = plus.webview.currentWebview();
					     for (var i = 0; i < _this.views.length; i++) {
					     	var tempWebView = plus.webview.create(_this.views[i].url, _this.views[i].name, {
					     		top: "0px",
					     		bottom: "50px",
					     		scrollIndicator: "none",
					     		zindex: 1
					     	});
					     	currentWebView.append(tempWebView);
					     }
					     plus.webview.show(_this.views[0].name);
					});
					
					
				}
			})
		</script>

	</body>
</html>
